<template>
	<div class="default-right">
		<div class="tips">
			<YRCardTitle title="加油啊 | 愿为理想不为生活"></YRCardTitle>
			<div class="content">
				<p>知足且上进</p>
				<p>温柔又坚定</p>
			</div>
		</div>
		<YRCard title="推荐阅读" :list="articleList"></YRCard>
		<h1 style="height: 15px;"></h1>
		<YRCard title="满堂花醉" :list="articleList"></YRCard>
		<h1 style="height: 15px;"></h1>
		<YRTag></YRTag>
	</div>
</template>

<script>
import YRCard from '@/components/common/YRCard.vue';
import YRTag from '@/components/common/YRTag.vue';
import YRCardTitle from '@/components/common/YRCardTitle.vue';
export default {
  name: 'NovelRight',
  components: {
	YRCard,YRTag,YRCardTitle
  },
  data:()=>{
	return {
		articleList:[],
		param:{
			pageNumber:1,
			pageSize:5
		}
	}
  },
  methods:{
	getArticleRecommend(){
		this.$http.post("/api/article/getArticleRecommend",this.param).then(res=>{
			this.articleList = res.records.map(e=>{
				let obj={
					name:e.title,
					url:'/article/articleContent/?id='+e.id
				}
				return obj;
			});
		})
	}
  },
  created() {
	this.getArticleRecommend();
  }
}
</script>

<style lang="stylus" scoped="scoped">
.tips	
	border-radius: 10px
	overflow: hidden
	opacity 0.9
	background #fff
	margin-bottom 15px
	box-shadow 0 0 0 1px rgba(0,0,0,.02), 0 4px 10px rgba(0,0,0,.06)
	.content
		padding 15px
		text-align center
		border 1px solid #eee
</style>
